<template>
    <div class="col-sm-12 comment-list">
        <div class="index-book col-sm-12 col-xs-12">
            <a class="list-hover">最新</a>
        </div>
        <ul class="list-unstyled col-sm-12 col-xs-12">
            <li v-for="item in dataJson" class="text-hidden" style="padding-top: 10px;">
            	<router-link :to="item.url+'/'+item.id">
            		<span class="author">{{item.name}}</span>
            		{{item.content}}
            	</router-link>
            </li>
        </ul>
    </div>
</template>

<script>
export default {
	props : {
		dataJson : {
			type : Array,
			required : true
		}
	},
	mounted ($route) {
 		this.$nextTick(()=>{
 		})
 	},
 	filters : {
 		getHref : function(val){
 			return "/filmDetail/"+val;
 		}
 	}
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.comment-list{
    font-size: 12px;
    color: #333;
}
.index-book{
    background:#f5f5f5;
    height:40px;
    line-height:40px;
    border-radius:5px;
}
.author{
    width: 60px;
    text-align: center;
    border-radius: 3px;
    background: #dfdfdf;
    display: inline-block;
    margin-right: 5px;
    line-height: 30px;
}

</style>
